<template>
  <div class="contact">
    <h1>2025工业软件创新发展大会</h1>
    <p><span>地址：</span>{{ contactData.address }}</p>
    <p><span>邮编：</span>{{ contactData.zip_code }}</p>
    <p><span>电话：</span>{{ contactData.phone }}</p>
    <p><span>邮箱：</span>{{ contactData.email }}</p>
    <p><span>QQ：</span>{{ contactData.qq }}</p>
    <p><span>官方QQ群：</span>{{ contactData.qq_group }}</p>
    <img :src="contactData.wx_code" alt="" srcset="" />
  </div>
</template>
<script>
  import {
    mapGetters,
    mapActions
  } from "vuex";
  export default {
    name: "contact",
    components: {},
    data() {
      return {};
    },
    mounted() {
      this.getContactData();
    },
    methods: {
      ...mapActions(["getContactData"]),
    },
    computed: {
      ...mapGetters(["contactData"]),
    },
  };
</script>
<style scoped>
  .contact {
    width: 900px;
    margin: 0 auto;
    padding: 100px 0;
    min-height: 600px;
  }

  .contact h1 {
    margin-bottom: 70px;
    font-size: 24px;
    color: #333;
    font-weight: bold;
  }

  .contact p {
    font-size: 18px;
    line-height: 36px;
    color: #666;
  }

  .contact span {
    color: #333;
    font-weight: bold;
  }

  .contact img {
    width: 126px;
    margin-top: 40px;
  }
</style>
